<template>
  <RouterView/>
  <!-- Tabbar标签栏 实现底部导航 -->
  <!-- route开启路由 同表示链接的地址 -->
  <van-tabbar placeholder="true" v-model="active" route>
    <van-tabbar-item to="/recommend" icon="good-job-o">推荐</van-tabbar-item>
    <van-tabbar-item to="/explore" icon="apps-o">探索</van-tabbar-item>
    <van-tabbar-item to="/social" icon="friends-o">社交</van-tabbar-item>
    <van-tabbar-item to="/message" icon="chat-o">消息</van-tabbar-item>
    <van-tabbar-item to="/user" icon="user-o">我的</van-tabbar-item>
  </van-tabbar>
</template>

<script setup>
import {ref} from "vue"

const active = ref(0);
</script>

<style scoped>
</style>
